import React, { useEffect } from 'react';
import { Container, Nav, NavLink } from 'react-bootstrap';
import constants from '../../constants';
import eventEmitter from '../../utils/EventEmitter';
import { Outlet } from 'react-router-dom';

const AIHome:React.FC = ()=>{
    
    useEffect(()=>{
        eventEmitter.dispatch(constants.str.hideTopContent)
        return ()=>{
            
        }
    },[])

    return (<Container fluid className='p-0 h-100'>
        <Nav>
            <Container fluid className='d-flex  p-0'>
                <NavLink href='/inference'>My Models</NavLink>
                <NavLink href='/inference/build'>Build New Model</NavLink>
                <NavLink href='/inference/build'>Use Model</NavLink>
                <NavLink href='/inference/build'>Dump Model</NavLink>
                <div className='d-flex flex-grow-1'/>
                <NavLink href='/' className=''>Back to Home</NavLink>
            </Container>
        </Nav>
        <Outlet/>
    </Container>)
}

export default AIHome;